import type { Field } from '#/pass'
import type { PassTemplate, Location, PKBarcode, TemplateInfo } from '@/api/pass/passModel'
import { defineStore } from 'pinia'

type Menu = 'AddItem' | 'Theme' | 'QRCode' | 'Location' | 'BlueTooth'
type RightPanelType = 'Item' | 'Application' | 'Logo' | null
export interface PassState {
  templateName: string
  activeMenu: Menu
  draggingItem: Field | null
  currentItemId: number | null
  items: Field[]  
  fields: Field[]
  backgroundColor: string
  labelColor: string
  textColor: string
  lockScreenIcon: string
  headLogo: string
  stripImage: string
  showBarcode: boolean
  barcodeImage: string
  textBelowBarcode: string
  passTemplate: PassTemplate
  rightPanelVisible: boolean
  rightPanelTitle: string
  rightPanelType: RightPanelType
}

const fields:Field[] = [
  { key: 'points', id: 1, label: '积分', type: 'Present', changeMessage: ''  },
  { key: 'memberNo', id: 2, label: '会员号', type: 'Present', changeMessage: ''  },
  { key: 'memberLevel', id: 4, label: '等级', type: 'Present', changeMessage: ''  },
  { key: 'eMail', id: 5, label: '邮箱', type: 'Present', changeMessage: ''  },
  { key: 'registerUrl', id: 6, label: '注册链接', type: 'Present', changeMessage: ''  },
  { key: 'merchantName', id: 7, label: '商户', type: 'Present', changeMessage: ''  },
  { key: 'moreInterests', id: 8, label: '更多权益', type: 'Present', changeMessage: ''  },
  { key: 'portal', id: 9, label: '门户', type: 'Present', changeMessage: ''  },
  { key: 'Expiry Date', id: 4, label: '', type: 'Advanced', changeMessage: ''  },
  { key: 'Email Address', label: '', id: 5, type: 'Advanced', changeMessage: ''  },
  { key: 'Mobile Number', label: '', id: 6, type: 'Advanced', changeMessage: ''  },
  { key: 'First Name', label: '', id: 7, type: 'Advanced', changeMessage: ''  },
  { key: 'Last Name', label: '', id: 8, type: 'Advanced', changeMessage: ''  },
  { key: 'Salutation', label: '', id: 9, type: 'Advanced', changeMessage: ''  },
  { key: 'Suffix', label: '', id: 10, type: 'Advanced', changeMessage: ''  },
  { key: 'Date of Birth', label: '', id: 12, type: 'Advanced', changeMessage: ''  },
  { key: 'Legal', label: '', id: 13, type: 'Advanced', changeMessage: ''  }
]


export const usePassStore = defineStore('pass', ({  
  state: ():PassState => ({
    templateName: 'My Loyalty Program',
    rightPanelVisible: false,
    rightPanelTitle: '',
    rightPanelType: null,    
    activeMenu: 'AddItem',
    draggingItem: null,
    currentItemId: null,
    items: [],
    fields: [...fields],
    backgroundColor: 'rgb(51, 38, 174)',
    labelColor: 'rgb(255, 255, 255)',
    textColor: 'rgb(255, 255, 255)',
    showBarcode: true,
    lockScreenIcon: new URL('/src/views/pass-center/design/assets/unionpay.png', import.meta.url).href,
    headLogo: new URL('/src/views/pass-center/design/assets/unionpay.png',  import.meta.url).href,
    stripImage: new URL('/src/views/pass-center/design/assets/铂金.png', import.meta.url).href,
    barcodeImage: new URL('/src/views/pass-center/design/assets/barcode.png',import.meta.url).href,
    textBelowBarcode: '${pid}',
    passTemplate: {
      remark: '',
      associatedStoreIdentifier: 600273928,
      backFields: [],
      backgroundColor: 'rgb(51, 38, 174)',
      barcodes: [{
        altText: '',
        format: 'PKBarcodeFormatCode128',
        message: 'pid',
        messageEncoding: '${pid}'
      }],
      description: 'UnionPay Pass',
      headerFields: [],
      iconUuid: null,
      keyName: '公钥1',
      labelColor: 'rgb(255, 255, 255)',
      textColor: 'rgb(255, 255, 255)',
      locations: [],
      logoText: 'Union Pay',
      logoUuid: null,
      nfcKeyId: null,
      passChannel: 'APPLE',
      passType: 0,
      passTypeIdentifier: '',
      primaryFields: [],
      secondaryFields: [],
      stripUuid: null,
      tempName: 'My Loyalty Program',
      tempType: 0,
      thumbUuid: null,
      webServiceURL: 'https://pass.newlandnpt.com',
      beacons: [{major: 0, minor: 0, proximityUUID: '', relevantText: ''}],
      templateLevel: null,
      topicId: null
    }
  }),
  getters: {
    getCurrentItem(state): Field | undefined {      
      return state.items.find(item => item.id === state.currentItemId)
    }
  },
  actions: {  
    setDraggingItem(item: Field) {
      this.draggingItem = item
    },
    setRightPanelVisible(visible: boolean) {
      this.rightPanelVisible = visible
    },
    setRightPanelType(type: RightPanelType) {
      this.rightPanelType = type
    },
    setActiveMenu(menu: Menu) {
      this.activeMenu = menu
    },
    setCurrentItemId(id: number) {
      this.currentItemId = id
    },
    setItems(items: Field[]) {
      this.items = items
    },  
    addItem(item: Field) {
      this.items.push(item)
    },
    addFieldsItem(item: Field) {
      const field = fields.find(f => f.key === item.key)
      this.fields.push(field)
    },
    removeFieldsItem(key: string) {      
      const index = this.fields.findIndex(field => field.key === key)
      this.fields.splice(index, 1) 
    },
    setBackgroundColor(color: string) {      
      this.passTemplate.backgroundColor = color
    },
    setLabelColor(color: string) {      
      this.passTemplate.labelColor = color
    },
    setHeadLogo(image: string) {
      this.headLogo = image
    },
    setLockScreenIcon(image: string) {
      this.lockScreenIcon = image
    },
    setThumbUuid(uuid: string) {
      this.passTemplate.thumbUuid = uuid
    },    
    setLogoUuid(uuid: string) {
      this.passTemplate.logoUuid = uuid
    },
    setIconUuid(uuid: string) {
      this.passTemplate.iconUuid = uuid
    },
    setStripUuid(uuid: string) {
      this.passTemplate.stripUuid = uuid
    },    
    setStripImage(image: string) {
      this.stripImage = image
    },
    setBarCodeImage(image: string) {
      this.barcodeImage = image
    },
    setShowBarcode(show: boolean) {
      this.showBarcode = show
    },
    setTextBelowBarcode(text: string) {
      this.textBelowBarcode = text
    },
    setLogoText(text: string) {
      this.passTemplate.logoText = text
    },
    setTemplateName(templateName: string) {
      this.passTemplate.tempName = templateName
    },
    setDescription(description: string) {
      this.passTemplate.description = description
    },
    setPassTemplateField(key: 'backFields' | 'secondaryFields' | 'headerFields' , fields: Field[]) {
      this.passTemplate[key] = fields.map(field => ({        
        key: field.key,
        label: field.label,
        changeMessage: field.changeMessage
      }))
    },
    setPassTypeIndentifier(passTypeIdentifier: string) {
      this.passTemplate.passTypeIdentifier = passTypeIdentifier
    },
    setBarCode(barCode: PKBarcode[] | null) {
      this.passTemplate.barcodes = barCode
    },
    addLocation(location: Location) {
      this.passTemplate.locations.push(location)
    },
    setPassTemplateFromInfo(info: TemplateInfo) {
      this.passTemplate = Object.assign(this.passTemplate, info)
    },
    setRightPanelTitle(title: string) {
      this.rightPanelTitle = title
    },
    setTopicId(topicId: number) {
      this.passTemplate.topicId = topicId
    },
    setTemplateLevel(templateLevel: number) {
      this.passTemplate.templateLevel = templateLevel
    },
    setNfcKeyId(nfcKeyId: number | null) {
      this.passTemplate.nfcKeyId = nfcKeyId
    }
  }
}))